(function () {
    let template = function (self) {
        return self.innerHTML;
    };

    function handleAttribute(self) {
        if (!self.hasAttribute("disabled")) {
            var isAdd = self.auiToggleAttribute("open", "open")
        }
    }

    function onClicked(self) {
        return function (e) {        
            handleAttribute(self);
        }
    }

    function onDocumentClicked(self) {
        return function (e) {  
            if (!self.contains(e.target)) {
                self.removeAttribute("open");
            }
        }
    }

    function enableTypePopup(self) {
        document.addEventListener("click", self.$onDocumentClicked);
    }

    function disableTypePopup(self) {
        document.removeEventListener("click", self.$onDocumentClicked);
    }

    document.auiDefineElement(
        'aux-details',
        {
            template,
            attached(self) {
                self.$locked = false;
                self.$onClicked = onClicked(self);
                self.$onDocumentClicked = onDocumentClicked(self);
                self.$ele.summary = self.auiFindSelector("> aux-summary");
                if (self.$ele.summary && self.$ele.summary !== null) {
                    self.$ele.summary.addEventListener("click", self.$onClicked);
                }
                if (self.getAttribute("type") === "popup") {
                    enableTypePopup(self);
                }
            },
            attrChanged (self, name, oldval, newval) {
                if (name === "type" && newval === "popup") {
                    enableTypePopup(self);
                }
                if (name === "type" && newval !== "popup") {
                    disableTypePopup(self);
                }
            }
        }
    );

})();


